<template>
  <FormItemWraaper v-bind="$attrs" :selectedWidget="selectedWidget" :editorProps="editorProps">
    <ApiSelect
      v-bind="editorProps"
      showSearch
      v-model:value="state"
      :filterOption="false"
      :placeholder="editorProps?.placeholder || '请选择'"
      labelField="label"
      valueField="value"
    />
  </FormItemWraaper>
</template>
<script lang="ts" name="select-editor" setup>
  import { ref, computed, onMounted } from "vue"
  import { useRuleFormItem } from "/@/hooks/component/useFormItem"
  import { useI18n } from "/@/hooks/web/useI18n"
  import { useAttrs } from "/@/hooks/core/useAttrs"
  import { ApiSelect } from "/@/components/Form/index"
  import FormItemWraaper from "./PropFormItemWrapper.vue"
  import type { Designer } from "../../type"
  const { t } = useI18n("diyForm")

  const props = defineProps({
    value: { type: String },
    editorProps: { type: Object, default: () => {} },
    selectedWidget: Object,
    designer: { type: Object as () => Designer },
  })
  const emit = defineEmits(["update:value"])
  const [state] = useRuleFormItem(props, "value", "update:value")
  onMounted(() => {})
</script>

<style lang="less"></style>
